<!DOCTYPE html>
<html class="ui-page-login">

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/pages/login.css" />
	</head>
 
	<body>
		
		<div id="app" class="content">
			<div class="logo">
				<img src="images/logo.png" >
			</div>
			<form id='login-form' class="">
				<div class="itemClass">
					<input id='account' type="number" placeholder="输入账号" class="mui-input-clear mui-input">
				</div>
				<input type="number" style="opacity: 0;position: absolute;transform: scale(0.1);"  />
				<div class="itemClass">
					<input id='password' placeholder="输入密码" type="password" class="mui-input-clear mui-input">
				</div>
			</form>			
			<form>
				<div class="register">
					<span>自动登录</span>
					<div id="autoLogin" class="mui-switch mui-switch-mini">
						<div class="mui-switch-handle"></div>
					</div>
				</div>
			</form>
			<div class="mui-content-padded">
				<div id='login' class="login">登录</div>
				<div class="link-area">
					<a id='reg'>注册账号</a>
					<a id='forgetPassword'>忘记密码</a>
				</div>
			</div>
		</div>
		<div class="mui-content-padded oauth-area"></div>
		<script src="js/Width.js"></script>
		<script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.enterfocus.js"></script>
		<script src="js/Util.js"></script>
		<script src="js/app.js"></script>
		<script src="https://cdn.bootcss.com/fastclick/1.0.6/fastclick.min.js"></script>
		<script>
			mui.init()
			mui.plusReady(function() {
// 				if(!mui.os.android){
// 					FastClick.attach(document.body);
// 				}
				plus.navigator.setStatusBarBackground("#FFFFFF")
				plus.navigator.setStatusBarStyle("dark")
				plus.webview.currentWebview().setStyle({
					softinputMode: "adjustResize"
				});
				var settings = app.getSettings();
				var state = app.getState();

				var toMain = function() {
					mui.openWindow({
						url: 'index.html',
						id: 'index',
						show: {
							aniShow: 'pop-in'
						}, 
						waiting: {
							autoShow: false
						}
					})
				};
				//检查 "登录状态/锁屏状态" 开始  && state.token
				if(settings.autoLogin && state.userID) {
					//toMain(); // 方便外网观看
						var loginInfo = {
							account: state.account,
							password: state.password,
							userCID: state.userCID
						};
						console.log(loginInfo.account)
						console.log(loginInfo.password)
						app.login(loginInfo, function(err) {
							if(err) {
								plus.nativeUI.toast(err);
								return;
							}
							// toMain();
						});
				}

				var loginButton = document.getElementById('login');
				var accountBox = document.getElementById('account');
				var passwordBox = document.getElementById('password');
				var autoLoginButton = document.getElementById("autoLogin");
				var regButton = document.getElementById('reg');
				var forgetButton = document.getElementById('forgetPassword');
				if(state.userID) {
					accountBox.value =  state.account;
					passwordBox.value = state.password;
				}
				
				loginButton.addEventListener('tap', function(event) {
// 					plus.nativeUI.showWaiting('登录中', {
// 						width: '100px',
// 						height: '100px'
// 					});
					var loginInfo = {
						account: accountBox.value,
						password: passwordBox.value
					};
					app.login(loginInfo, function(err) {
						if(err) {
							plus.nativeUI.toast(err);
							// plus.nativeUI.closeWaiting();
							return;
						}
// 						plus.nativeUI.closeWaiting();
// 						mui.toast('登录成功')
// 						toMain();
					});
				});
				mui.enterfocus('#login-form input', function() {
					mui.trigger(loginButton, 'tap');
					plus.key.hideSoftKeybord();
				});
				autoLoginButton.classList[settings.autoLogin ? 'add' : 'remove']('mui-active')
				autoLoginButton.addEventListener('toggle', function(event) {
					setTimeout(function() {
						var isActive = event.detail.isActive;
						console.log(isActive)
						settings.autoLogin = isActive;
						app.setSettings(settings);
					}, 50);
				}, false);
				regButton.addEventListener('tap', function(event) {
					mui.openWindow({
						url: 'register/reg.html',
						id: 'reg',
						preload: true,
						show: {
							aniShow: 'pop-in'
						},
						styles: { // 窗口参数 参考5+规范中的WebviewStyle,也就是说WebviewStyle下的参数都可以在此设置
							titleNView: { // 窗口的标题栏控件
								titleText: "注册", // 标题栏文字,当不设置此属性时，默认加载当前页面的标题，并自动更新页面的标题         // 字体颜色,颜色值格式为"#RRGGBB",默认值为"#000000"
								titleSize: "17px", // 字体大小,默认17px
								type: 'transparent',
								backgroundColor: "#ffffff", // 控件背景颜色,颜色值格式为"#RRGGBB",默认值为"#F7F7F7"
								autoBackButton: true,
								splitLine: { // 标题栏控件的底部分割线，类似borderBottom
									color: "#eeeeee", // 分割线颜色,默认值为"#CCCCCC"  
									height: "1px" // 分割线高度,默认值为"2px"
								}
							}
						},
						waiting: {
							autoShow: false
						}
					});
				}, false);
				forgetButton.addEventListener('tap', function(event) {
					mui.openWindow({
						url: 'register/forget_password.html',
						id: 'forget_password',
						preload: true,
						show: {
							aniShow: 'pop-in'
						},
						styles: { // 窗口参数 参考5+规范中的WebviewStyle,也就是说WebviewStyle下的参数都可以在此设置
							titleNView: { // 窗口的标题栏控件
								titleText: "忘记密码", // 标题栏文字,当不设置此属性时，默认加载当前页面的标题，并自动更新页面的标题         // 字体颜色,颜色值格式为"#RRGGBB",默认值为"#000000"
								titleSize: "17px", // 字体大小,默认17px
								type: 'transparent',
								backgroundColor: "#ffffff", // 控件背景颜色,颜色值格式为"#RRGGBB",默认值为"#F7F7F7"
								autoBackButton: true,
								splitLine: { // 标题栏控件的底部分割线，类似borderBottom
									color: "#eeeeee", // 分割线颜色,默认值为"#CCCCCC"  
									height: "1px" // 分割线高度,默认值为"2px"
								}
							}
						},
						waiting: {
							autoShow: false
						}
					});
				}, false);

				var backButtonPress = 0;
				mui.back = function(event) {
					backButtonPress++;
					if(backButtonPress > 1) {
						plus.runtime.quit();
					} else {
						plus.nativeUI.toast('再按一次退出应用');
					}
					setTimeout(function() {
						backButtonPress = 0;
					}, 1000);
					return false;
				};

				setTimeout(function() {
					//关闭 splash
					plus.navigator.closeSplashscreen();
				}, 1000);
			})
		</script>
	</body>
</html>